import { FC } from 'react';
import { TextField, ToggleButtonGroup, ToggleButton } from '@mui/material';
import './index.less';

const ResourcesControl: FC = () => {
  return (
    <div className='resources-control'>
      <label className='control'>
        搜索：
        <TextField label='搜索资源' size='small' />
      </label>
      <label className='control'>
        排序：
        <ToggleButtonGroup color="primary" size='small' value='综合' exclusive>
          <ToggleButton className='button' value='综合'>综合</ToggleButton>
          <ToggleButton className='button' value='时间'>时间</ToggleButton>
          <ToggleButton className='button' value='评分'>评分</ToggleButton>
          <ToggleButton className='button' value='收藏'>收藏</ToggleButton>
        </ToggleButtonGroup>
      </label>
    </div>
  );
};

export default ResourcesControl;
